import echarts from 'echarts';

interface IConfig {
  dataX?: Array<string>,
  nameX?: string,
  nameY?: string,
  dataY?: Array<number>,
  ref: any,
  color?: Array<any>,
  legendData?: Array<any>,
  label?: Array<any>,
  seriesGoodData?: Array<any>,
  seriesBadData?: Array<any>,
  showMonth?: string,
  showCompareMonth?: string,
  title?: string,
  type?: string
}

export function SingleBar(config: IConfig) {
  if(config.ref) {
    let myChart = echarts.init(config.ref);
    let option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'shadow'
        }
      },
      title: {
        text: config.title ? config.title : '',
        left: 'center',
        fontSize: 20,
        color: "#333"
      },
      legend: {
        data: config.legendData,
        bottom: '-2.5%'
      },
      grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
      },
      xAxis: {
        type: 'value',
        boundaryGap: [0, 0.01]
      },
      yAxis: {
        type: 'category',
        data: config.label || ['整改数','隐患数','报警数','报警处理数']
      },
      series: [
        {
          name: config.legendData[0],
          type: 'bar',
          color: config.color[0],
          label: {
            normal: {
              show: true,
              position: 'inside',
              formatter: function(data) {
                return data.value;
              }
            }
          },
          data: config.seriesGoodData
        },
        {
          name: config.legendData[1],
          type: 'bar',
          color: config.color[1],
          label: {
            normal: {
              show: true,
              position: 'inside',
              formatter: function(data) {
                return data.value;
              }
            }
          },
          data: config.seriesBadData
        }
      ]
    };

    myChart.setOption(option)
  }
}
